<template>
  <view class="page">

    <!-- 筛选 -->
   <view class="top_title">-----------为你推荐----------- </view>
    <!--商品列表-->
    <view class="list">
      <view  class="padding-lr-sm">
        <view class="grid col-2">
          <block v-for="item in tableList" :key="item.id">
            <!-- #ifdef MP-WEIXIN -->
            <view>
              <!-- #endif -->
              <fu-goods-block :info="item"></fu-goods-block>
              <!-- #ifdef MP-WEIXIN -->
            </view>
            <!-- #endif -->
          </block>
        </view>
      </view>
    </view>
<!-- 加载状态 -->
    <uni-load-more v-if="tableList.length > 5" :status="status"></uni-load-more>
  </view>
</template>
<script>

  import { message } from '@/common/utils/message.js'
  export default {
    name: "fu-recommend",
    props: {
      url: {
        type: String,
        default:global.apiUrls.productRecommend
      },
      isLoad:{
        type:Boolean,
        default:true
      }
    },
    data() {
      return {
        tableList:[],
        isInit: false, // 是否请求过数据
        status: 'more', // 加载状态
        page: 1, // 页数
        size: 10, // 页条数

      };
    },
    mounted() {
      this.handleSearch()
    },
    onReachBottom() {
      console.log(999)
      this.handleSearch();
    },
    methods: {
      handleSearch() {
        if(this.status != 'more') return;
        this.status = 'loading';
        
        this.$api.post(this.url,{
          type:0,
          size:this.size,
          page:this.page
        }).then((res) => {
          console.log(res,555555555555)
          if (res.data.code == 1) {
            // this.tableList=res.data.data.data
            // let totalSize = res.data.data.total;

            console.log(res.data.data)
            let list = res.data.data.data;
            if (this.page == 1){
              this.tableList = [];
            }
            this.tableList = this.tableList.concat(list);

            // if (this.lists.length >= totalSize) {
            //   this.status = 'noMore';
            // } else {
            //   this.status = 'more';
            //   this.page++;
            // }
            this.isInit = true;

          }
        }).catch(err=>{
        });
      },
    }
  };
</script>

<style lang="scss" scoped>
  .page {
    min-height: 100%;
  }
  .top_title{
    width:100%;
    text-align: center;
    height: 50rpx;
    line-height: 50rpx;
    margin-top:20rpx;
  }


  .list-item+.list-item {
    border-top: 1rpx solid #EEEEEE;
  }

  .animate {
    position: fixed;
    border-radius: 50%;
    z-index: 995;
    transform-origin: 50% 50%;
    transition: transform linear 0.5s, left linear 0.5s, top cubic-bezier(0.3, -0.2, 1, 0) 0.5s !important;

    image {
      width: 100rpx;
      height: 100rpx;
      border-radius: 50%;
    }
  }
</style>
